jQuery(function($) {
    $('.modal.aside').ace_aside();
})

var urls = {
    index: 'index',
    cs: 'cs',
    del: 'del',
    edit: 'edit',
    add: 'add',
}
var $table = $('#list-container')
initTable();
function refreshTable() {
    var querys = ace.form.serialize('.table-search form')
    $table.ace_table('refresh', {
        query: querys
    });
}
function cs(id, status) {
    ace.helper.ajax(urls.cs, {id: id, status: status}, function() {
        refreshTable()
    })
}
function remove(id) {
    ace.alert.confirm('确定要删除吗？', function(){
        ace.helper.ajax(urls.del, {id: id}, function() {
            refreshTable()
        })
    })
}

function initTable () {
    $table.bootstrapTable('destroy');
    var columns = [
        {title: 'ID', field: 'id'},
        {title: '名称', field: 'name', formatter: function(value, row, index){
            if (row.icon) {
                return '<i class="ace-icon '+row.icon+'"></i> ' + value
            }
            return value
        }},
        {title: '链接地址', field: 'router'},
        {title: '是否显示', field: 'is_show', formatter: function(value, row, index){
            if (value == 1)
                return '<span class="badge badge-success">是</span>'
            else
                return '<span class="badge badge-grey">否</span>'
        }},
        {title: '排序值', field: 'sort', editable: {
            type: 'text',
            validate: function (v) {
                if(v.length<1) return '不能为空';
            }
        }},
        {title: '状态', field: 'status', width: '80px', formatter: function(value, row, index){
            if (value == 1)
                return '<span class="badge badge-success">启用</span>'
            else
                return '<span class="badge badge-grey">禁用</span>'
        }},
        {title: '备注', field: 'intro'},
        {title: '最后修改时间', field: 'updated_at', width: '160px'},
        {title: '操作', width: '220px', cellStyle: {
                css: {'max-width': '220px'},
            },class: 'actions', formatter: function(value, row, index) {
                var html = '<a onclick="editMenu('+row.id+')">编辑</a>';
                if (row.status==1) {
                    html += '<a onclick="disable('+row.id+')">禁用</a>'
                } else {
                    html += '<a onclick="enable('+row.id+')">启用</a>';
                }
                html += '<a onclick="remove('+row.id+')">删除</a>';
                if (row.level < 3) {
                    html += '<div class="inline more-actions"><div class="dropdown">'+
                        '<button class="btn dropdown-toggle" data-toggle="dropdown">更多操作<span class="caret"></span></button>'+
                        '<ul class="dropdown-menu pull-right" style="min-width: 80px">';
                    html += '<li><a onclick="addMenu('+row.id+')">添加子菜单</a></li>'
                    html += '</ul></div></div>'
                }
                return html;
            }}
    ]
    $table.ace_table({
        url: urls.index,
        detailView: true,
        pagination: false,
        columns: columns,
        queryParams: function (params){
            return $.extend({}, params, ace.form.serialize('.table-search form'))
        },
        onEditableSave: function (field, row, index, oldValue, ele) {
            ace.helper.tableEdit(field, row, index, oldValue, ele, urls.edit, t)
        },
        onExpandRow: function (index, row, detail) {
            var cur_table = detail.html('<table></table>').find('table');
            cur_table.ace_table({
                url: urls.index,
                detailView: true,
                columns: columns,
                pagination: false,
                toolbar: false,
                queryParams: function (params){
                    return $.extend({}, params, ace.form.serialize('.table-search form'), {pid: row.id})
                },
                onEditableSave: function (field, row, index, oldValue, ele) {
                    ace.helper.tableEdit(field, row, index, oldValue, ele, urls.edit, t)
                },
                onExpandRow: function (index, row, detail) {
                    var cur_table = detail.html('<table></table>').find('table');
                    cur_table.ace_table({
                        url: urls.index,
                        columns: columns,
                        pagination: false,
                        toolbar: false,
                        queryParams: function (params){
                            return $.extend({}, params, ace.form.serialize('.table-search form'), {pid: row.id})
                        },
                        onEditableSave: function (field, row, index, oldValue, ele) {
                            ace.helper.tableEdit(field, row, index, oldValue, ele, urls.edit, t)
                        },
                    });
                }
            })
        }
    })
}


jQuery(function($) {

    // $('input[name=open_time]').timepicker({
    //     defaultTime: '08:00',
    //     minuteStep: 10,
    //     showSeconds: false,
    //     showMeridian: false,
    //     disableFocus: true,
    //     icons: {
    //         up: 'fa fa-chevron-up',
    //         down: 'fa fa-chevron-down'
    //     }
    // })
    // $('input[name=close_time]').timepicker({
    //     defaultTime: '20:00',
    //     minuteStep: 10,
    //     showMeridian: false,
    //     disableFocus: true,
    //     icons: {
    //         up: 'fa fa-chevron-up',
    //         down: 'fa fa-chevron-down'
    //     }
    // })
});

// ace.upload.singleImg.init({
//     pick: '#coverImgPicker',
//     filename: 'shop_cover',
//     success: function (file, res) {
//         if (res.code == 0) {
//             $('input[name=cover_url]').val(res.data.filepath)
//             $('#shopCoverBox .imgItem').css('background-image', 'url('+res.data.fileUrl+')')
//             $('#shopCoverBox').show()
//             $('input[name=cover_img]').closest('.form-group').find('.help-block').remove();
//         } else {
//             layer.msg(res.msg, {icon: 2});
//         }
//     }
// })

function addMenu(pid) {
    $.get(urls.add, {pid: pid}, function(res) {
        $('body').append(res)
        $('#aside-menu').modal('show')
    })
}
function editMenu(id) {
    $.get(urls.edit, {id: id}, function(res) {
        $('body').append(res)
        $('#aside-menu').modal('show')
    })
}
$(document)
.on('hide.bs.modal', '#aside-menu', function(e) {
    $(this).remove();
})
.on('show.bs.modal', '#aside-menu', function(e) {
    ace.form.ajaxSub('#saveForm', function() {
        refreshTable()
    })
})
